<template>
	<view class="content">
		<view class="tab-box">
			<u-tabs :list="tabList" @click="tabChange" :scrollable="false" lineColor="#4871C0" :current="activeIndex"
				lineWidth="70rpx" lineHeight="5rpx" :activeStyle="{
			    color: '#4871C0',
			    fontWeight: 'bold',
				fontSize:'28rpx',
			}" :inactiveStyle="{
			    color: '#999999',
				fontSize:'28rpx',
			}" itemStyle="padding-left: 15px; padding-right: 15px; height: 34px;width:30%;padding-bottom:10rpx;"></u-tabs>
		</view>
		<!-- 待进行 -->
	<!-- 	<view class="time-box" v-if="activeIndex == 1 || activeIndex == 0">
			<view class="tiem-tiem" v-for="(item,index) in timeList" :key="index"
				:class="activeNum === index ? 'active':''" @click="changTiem(index)">
				{{item.name}}
			</view>
			<img class="serach" src="@/static/img/serach.png" />
		</view> -->
		<!-- 待审批 -->
		<view class="time-box" v-if="activeIndex == 2">
			<view class="tiem-tiem" v-for="(item,index) in stateList" :key="index"
				:class="stateactiveNum === index ? 'active':''" @click="changstatusTiem(index)">
				{{item.name}}
			</view>
		</view>
		<!-- 通知列表 -->
		<view class="list" v-if="activeIndex == 0">
			<view class="" v-if="dataList1.length">
				<view class="list-item" v-for="(item,index) in dataList1" :key="index" @click="godetails(item.meet_id,item.type)">
					<view class="item-info">
						<view class="item-tile">
							<view class="title">{{item.title}}</view>
						</view>
						<view class="address">
							{{item.content}}
						</view>
						<view class="time" v-if="item.bohui_content == ''">
							{{item.start_time}}
							<text v-if="item.status == 1">审批通过</text>
							<text v-else-if="item.status == 2 && item.type == 'room_order'">您有新的会议需要审核</text>
							<text v-else-if="item.status == 0">会议取消</text>

						</view>
						<view class="time" v-if="item.bohui_content != ''">
								{{item.start_time}}
								<text>{{item.bohui_content}}</text>
						</view>
					</view>
				</view>
			</view>
			<!-- 加载更多 -->
			<u-loadmore v-if="dataList1.length" :status="loadStatus" />

			<u-empty v-if="!dataList1.length && !isLoading" mode="data"
				icon="http://cdn.uviewui.com/uview/empty/car.png">
			</u-empty>
		</view>

		<!-- 待进行的列表 -->
		<view class="list" v-if="activeIndex == 1">
			<view class="" v-if="dataList2.length">
				<view class="list-item" v-for="(item,index) in dataList2" :key="index" @click="godetails(item.id)">
					<view class="item-img">
						<u--image :src="item.user.avatar" width="44rpx" height="44rpx" shape="circle">
						</u--image>
					</view>
					<view class="item-info">
						<view class="item-tile">
							<view class="title">{{item.title}}</view>
						<!-- 	<text v-if="item.status_name.index ==  1" class="state state1">待审批</text>
							<text v-if="item.status_name.index ==  2" class="state state5">审核不通过</text>
							<text v-if="item.status_name.index ==  3" class="state state6">待进行</text>
							<text v-if="item.status_name.index ==  4" class="state state4">进行中</text>
							<text v-if="item.status_name.index ==  5" class="state state3">已结束</text>
							<text v-if="item.status_name.index ==  0" class="state state3">已取消</text> -->
							<text v-if="item.status == 1" class="state state1">待进行</text>
							<text v-if="item.status == 8" class="state state1">进行中</text>
						</view>
						<view class="address">
							{{item.type_name}} | {{item.room.title}}
						</view>
						<view class="time">
							{{item.time}}
						</view>
					</view>
				</view>
			</view>
			<!-- 加载更多 -->
			<u-loadmore v-if="dataList2.length" :status="loadStatus" />

			<u-empty v-if="!dataList2.length && !isLoading" mode="data"
				icon="http://cdn.uviewui.com/uview/empty/car.png">
			</u-empty>
		</view>

		<!-- 待审批列表 -->
		<view class="list" v-if="activeIndex == 2">
			<view class="" v-if="dataList3.length">
				<view class="list-item" v-for="(item,index) in dataList3" :key="index" @tap="godetails(item.id)">
					<!-- <view class="item-img">
						<u--image src="https://cdn.uviewui.com/uview/album/1.jpg" shape="circle" width="44rpx"
							height="44rpx">
						</u--image>
					</view> -->
					<view class="item-info">
						<view class="item-tile">
							<view class="title title1">{{item.title}}</view>
						</view>
						<view class="address" style="margin: 18rpx 0;">
							{{item.type_name}}    |    {{item.room.title}}
						</view>
						<view class="time u-flex">
							<text>{{item.time}}</text>
						</view>
						<!--发起人 -->
						<!-- <view class="" v-if="item.user_id === user_id">
							<view class="approved-tip">
								03.26 15:26 审核通过
							</view>
							<view class="audit-failed">
								<view class="audit-failed-time">
									03.26 15:26 审核失败
								</view>
								<view class="audit-failed-content" v-if="item.meet_check">
									拒绝理由：{{item.meet_check.content}}
								</view>
							</view>
						</view> -->
						<!-- 管理员身份不显示按钮 -->
						<!-- 校长身份按钮 -->
						<view class="item-button">
							<!-- 校长审核议题 -->
							<text v-if="item.is_xiaozhang==1 && item.is_yiti_status == 1" @tap.stop="gotopicDetails(item.id)">审核议题</text>
							<!-- 签发人审核会议纪要 v-if="item.role_type==6" -->
							 <text  v-if="item.is_qianfa==1 && item.is_jiyao == 1"  @tap.stop="gotomeetingMinutes(item.id)">审核会议纪要</text>
							  <text  v-if="item.is_shenhe==1 && item.status == 2"  @tap.stop="gomeetdetails(item.id)">审核会议室</text>
						</view>
					</view>
				</view>
			</view>
			<!-- 加载更多 -->
			<u-loadmore v-if="dataList3.length" :status="loadStatus" />

			<u-empty v-if="!dataList3.length && !isLoading" mode="data"
				icon="http://cdn.uviewui.com/uview/empty/car.png">
			</u-empty>
		</view>



	</view>
</template>

<script>
	import {
		getMeetwaitList,
		getMeetnoticeList,
		getMeetcheckList
	} from '@/api/meetApi.js'
	import {
		getUser
	} from '@/api/userApi.js'
	export default {
		data() {
			return {
				token:'',
				tabList: [{
					name: '通知',
				}, {
					name: '待进行',
				}, {
					name: '待审批'
				}],
				activeIndex: 0,
				timeList: [{
						name: "全部 6"
					},
					{
						name: "今天 2"
					},
					{
						name: "明天 2"
					},
					{
						name: "本周 2"
					}
				],
				activeNum: 0,
				stateList: [{
						name: "待审批"
					},
					{
						name: "已通过"
					}
				],
				isLoading: true,
				stateactiveNum: 0,
				page: 1,
				limit: 12,
				lastPage: 0,
				// 通知列表
				dataList1: [],
				day: '',
				// 待进行列表
				dataList2: [],
				// 待审批列表
				dataList3: [],
				loadStatus: '',
				title: '',
				statusQuery: 2,
				loadStatus: ''
			};
		},

		onLoad(options) {
			let token = uni.getStorageSync('token')
			if(options.token && !token){
				this.token = options.token;
				uni.setStorageSync('token', this.token);
				this.getUser()
			}
			// 获取待进行列表
			this.getDataList1()
			// this.getDataList2()
			// this.getDataList3()
		},
		onReachBottom: function() {
			if (this.page < this.lastPage) {
				this.page += 1;
				this.getDataList2();
			}
		},
		methods: {
			// 获取用户信息
			getUser(){
				let params = {
					token: this.token
				};
				getUser(params).then(res => {
					console.log(res)
				})
			},
			// 获取通知列表
			getDataList1() {
				this.loadStatus = 'loading';
				this.isLoading = true;
				let params = {
					page: this.page,
					limit: this.limit,
					day: this.activeNum
				};
				getMeetnoticeList(params).then(res => {
					this.isLoading = false;
					uni.stopPullDownRefresh();
					console.log(res)
					this.lastPage = res.data.last_page
					this.loadStatus = this.currentPage < res.data.last_page ? 'loadmore' : 'nomore';
					this.dataList1 = [...this.dataList1, ...res.data.data]
				})
			},
			// 获取待进行列表
			getDataList2() {
				this.loadStatus = 'loading';
				this.isLoading = true;
				let params = {
					page: this.page,
					limit: this.limit
				};
				getMeetwaitList(params).then(res => {
					this.isLoading = false;
					uni.stopPullDownRefresh();
					console.log(res)
					this.lastPage = res.data.last_page
					this.loadStatus = this.currentPage < res.data.last_page ? 'loadmore' : 'nomore';
					this.dataList2 = [...this.dataList2, ...res.data.data]
				})
			},
			// 获取待审批列表
			getDataList3() {
				this.loadStatus = 'loading';
				this.isLoading = true;
				let params = {
					page: this.page,
					limit: this.limit,
					status: this.statusQuery,
					day: '',
					title: this.title
				};
				getMeetcheckList(params).then(res => {
					this.isLoading = false;
					uni.stopPullDownRefresh();
					console.log(res)
					this.lastPage = res.data.last_page
					this.loadStatus = this.currentPage < res.data.last_page ? 'loadmore' : 'nomore';
					this.dataList3 = [...this.dataList3, ...res.data.data]
				})
			},
			// 重置数据
			resetData() {
				this.page = "";
				this.lastPage = "";
				this.loadStatus = "";
			},
			tabChange(item) {
				console.log('item', item);
				this.resetData();
				this.activeIndex = item.index;
				this.activeNum = 0;
				if (this.activeIndex == 0) {
					this.dataList1 = [];
					this.getDataList1()
				} else if (this.activeIndex == 1) {
					this.dataList2 = [];
					this.getDataList2()
				} else {
					this.dataList3 = [];
					this.getDataList3()
				}
			},
			// 时间改变
			changTiem(index) {
				console.log("index:", index)
				this.activeNum = index;
				this.resetData();
				if (this.activeIndex == 0) {
					this.dataList1 = [];
					this.getDataList1()
				} else if (this.activeIndex == 1) {
					this.dataList2 = [];
					this.getDataList2()
				}
			},
			// 状态改变
			changstatusTiem(index) {
				console.log("index:", index)
				this.stateactiveNum = index;
				if (index == 0) {
					this.statusQuery = 2
				} else if (index == 1) {
					this.statusQuery = 1
				} else {
					this.statusQuery = 3
				}
				this.resetData();
				this.dataList3 = [];
				this.getDataList3()
			},
			// changTiem(index){
			// 	console.log("index:", index)
			// 	this.activeNum = index;
			// },
			// 待进行详情
			godetails(id,type) {
				if(type == 'topic_add'){
					uni.navigateTo({
						url: '/pages/tabbar-1-detial/topics/shoujiTopics?id=' + id
					});
				}
        else if(type == 'topic_xiaozhang'){
          uni.navigateTo({
            url: '/pages/tabbar-3-detial/topicDetails/topicDetails?id=' + id
          });
        }else if(type == 'topic_check'){
					uni.navigateTo({
						url: '/pages/tabbar-1-detial/topics/topics?id=' + id
					});
				}else if(type == 'summary_add' || type == 'summary_edit' ){
					uni.navigateTo({
						url: '/pages/tabbar-3-detial/meetingMinutes/meetingMinutes?id=' + id
					});
				}else if(type == 'summary_check'){
					uni.navigateTo({
						url: '/pages/tabbar-1-detial/meetingMinutes/meetingMinutes?id=' + id
					});
				} else{
					uni.navigateTo({
						url: '/pages/tabbar-1-detial/meetingDetails/meetingDetails?id=' + id
					});
				}
			},
			gomeetdetails(id){
				uni.navigateTo({
					url: '/pages/tabbar-1-detial/meetingDetails/meetingDetails?id=' + id
				});
			},
			// 待审批详情
			// goapprovalDetails() {
			// 	uni.navigateTo({
			// 		url: '/pages/tabbar-1-detial/approvalDetails/approvalDetails'
			// 	});
			// },
			// 议题详情
			gotopicDetails(id) {
				uni.navigateTo({
					url: '/pages/tabbar-3-detial/topicDetails/topicDetails?id=' + id
				});
			},
			// 会议纪要
			gotomeetingMinutes(id) {
				uni.navigateTo({
					url: '/pages/tabbar-3-detial/meetingMinutes/meetingMinutes?id='+id,
				});
			},
		},
	};
</script>

<style>
	.content {
		background-color: #F8F8F8;
		min-height: 100vh;
	}

	.u-flex {
		display: flex;
	}

	.tab-box {
		padding: 20rpx 0;
		background-color: #fff;
		border-bottom: 6rpx solid #F8F8F8;
	}

	.time-box {
		padding: 28rpx 30rpx;
		display: flex;
		align-items: center;
		font-size: 24rpx;
		font-weight: 500;
		background: #fff;
	}

	.serach {
		margin-left: auto;
		width: 32rpx;
		height: 32rpx;
	}

	.tiem-tiem {
		padding: 14rpx 26rpx;
		background: #F3F3F3;
		color: #999999;
		border-radius: 162px 162px 162px 162px;
		opacity: 1;
		margin-right: 28rpx;
	}

	.active {
		opacity: 1;
		background-color: #fff;
		border: 1px solid #4871C0;
		color: #4871C0;
	}

	.list {
		padding: 20rpx 24rpx;
	}

	.list-item {
		padding: 30rpx 24rpx 30rpx 20rpx;
		background-color: #fff;
		border-radius: 16rpx;
		margin-bottom: 20rpx;
		/* display: flex;
		align-items: flex-start; */
	}

	.item-info {
		margin-left: 10rpx;
	}

	.item-tile {
		display: flex;
		justify-content: space-between;
	}

	.title {
		font-size: 32rpx;
		font-weight: bold;
		color: #333333;
		width: 80%;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		/* border: 1px solid red; */
	}

	.title1 {
		width: 100%;
	}

	.state {
		font-size: 24rpx;
		font-weight: 500;
		padding: 10rpx 12rpx;
	}

	.state1 {
		color: #8B48C0;
		background: #F8EEFF;
		border-radius: 8rpx;
		opacity: 1;
	}

	.state2 {
		color: #FF7A00;
		background: #FFECDA;
		border-radius: 8rpx;
		opacity: 1;
	}

	.state1 {
		color: #8B48C0;
		background: #F8EEFF;
		border-radius: 8rpx;
		opacity: 1;
	}

	.state2 {
		color: #4871C0;
		background: #EBF1FD;
		border-radius: 8rpx;
		opacity: 1;
	}

	.state3 {
		color: #999999;
		background: #F5F2F5;
		border-radius: 8rpx;
		opacity: 1;
	}

	.state4 {
		color: #26B167;
		background: #F2FFF8;
		border-radius: 8rpx;
		opacity: 1;
	}

	.state5 {
		color: #FA6161;
		background: #FFF0F0;
		border-radius: 8rpx;
		opacity: 1;
	}

	.state6 {
		color: #FF7A00;
		background: #FFECDA;
		border-radius: 8rpx;
		opacity: 1;
	}

	.address {
		font-size: 24rpx;
		font-weight: 500;
		color: #666666;
		margin-top: 10rpx;
	}

	.time {
		font-size: 24rpx;
		font-weight: 500;
		color: #666666;
		margin-top: 10rpx;
	}

	.item-button {
		text-align: right;
		margin-top: 16rpx;
	}

	.item-button text {
		text-align: center;
		display: inline-block;
		font-size: 28rpx;
		font-weight: 500;
		color: #4871C0;
		width: 186rpx;
		height: 64rpx;
		line-height: 64rpx;
		background:#F1F6FF;
		border-radius: 16rpx;
		opacity: 1;
		margin-right: 10rpx;
	}

	.noMore {
		font-size: 18rpx;
		color: #999999;
		text-align: center;
	}

	.name-text {
		margin: 0 10rpx;
	}

	.approved-tip {
		margin-top: 18rpx;
		font-size: 24rpx;
		font-weight: 500;
		color: #4871C0;
	}

	.audit-failed {
		margin-top: 18rpx;
		border-top: 2rpx dashed #ECECEC;
		padding-top: 18rpx;
	}

	.audit-failed-time {
		font-size: 24rpx;
		font-weight: 500;
		color: #FF7A00;
		margin-bottom: 10rpx;
	}

	.audit-failed-content {
		font-size: 24rpx;
		font-weight: 500;
		color: #666666;
		line-height: 44rpx;
	}
</style>
